import { defineStore } from 'pinia'
import { StyleImg, ProductListType, SearchProduct, SearchPost } from '../types/types'

// 你可以任意命名 `defineStore()` 的返回值，但最好使用 store 的名字，同时以 `use` 开头且以 `Store` 结尾。
// (比如 `useUserStore`，`useCartStore`，`useProductStore`)
// 第一个参数是你的应用中 Store 的唯一 ID。
export const useCommonStore = defineStore('common', {
	state: () => ({
		nowSelectedId: "",
		name: '',
		menuList: [],// 新增状态用于存储商品列表
		styleList: [],// 新增状态用于存储样式列表
		keyWord: "",
		language: "",
		searchProductList: [],// 搜索的商品列表
		searchPostList: [],// 搜索的帖子列表
		tabsIndex: "0",  //tabs索引
		pageSource: 'square',  //从哪一页跳转到搜索首页
		productIdCode: "", //搜索页点击某产品，跳转到list页
		noMorePost: false,   //没有更多帖子
		tipsWord: false, //商品页最底部是否显示“下拉刷新”
		activeIndex: 0, // 当前选中的 Tab 索引，默认 0
	}),
	getters: {
		getMenuList: (state) => state.menuList,
		// 可以添加获取 styleList 的 getter
		getStyleList: (state) => state.styleList,
		getKeyWord: (state) => state.keyWord, // 可选：添加 getter 访问 keyWord
		getLang: (state) => state.language,
		getSearchProductList: (state) => state.searchProductList,
		getSearchPostList: (state) => state.searchPostList,
		getTabsIndex: (state) => state.tabsIndex,
		getPageSource: (state) => state.pageSource,
		getProductIdCode: (state) => state.productIdCode,
		getNoMorePost: (state) => state.noMorePost,
		getTipsWord: (state) => state.tipsWord,
		getActiveIndex: (state) => state.activeIndex,
	},
	actions: {
		select(id: string) {
			this.nowSelectedId = id
			// console.log('选中的索引：', this.nowSelectedId)
		},
		setMenuList(list: Array<ProductListType>) {
			this.menuList = list
			// console.log('menuList 已更新:', this.menuList)
		},

		// 新增 action 用于设置 styleList
		setStyleList(list: Array<StyleImg>) {
			this.styleList = list
			// console.log('styleList 已更新:', this.styleList)
		},
		setKeyWord(keyword: string) { // 新增 action 用于更新关键词
			this.keyWord = keyword;
			console.log('搜索关键词已更新:', this.keyWord);
		},
		setLang(language: string) { // 新增 action 用于更新关键词
			this.language = language;
			uni.setStorageSync('lang', this.language)
			console.log('语言已切换:', this.language);
		},
		setSearchProductList(list: Array<SearchProduct>) {
			// 先赋空值再赋新值
			this.searchProductList = []
			this.searchProductList = list
			// console.log('searchProductList 已更新:', this.searchProductList)
		},
		setSearchPostList(list: Array<SearchPost>) {
			// 先赋空值再赋新值
			this.searchPostList = []
			this.searchPostList = list
			// console.log('searchPostList 已更新:', this.searchPostList)
		},
		setTabsIndex(tabsIndex: string) {
			this.tabsIndex = tabsIndex;
			console.log('tab索引已更新:', this.tabsIndex);
		},
		setPageSource(pageSource: string) {
			this.pageSource = pageSource;
			// console.log('pageSource已更新:', this.pageSource);
		},
		setProductIdCode(productIdCode: string) {
			// 先赋空值再赋新值
			this.productIdCode = '';
			this.productIdCode = productIdCode;
			// this.$patch({ productIdCode: productIdCode });  // 强制更新状态（即使值相同）
			// console.log('productIdCode已更新:', this.productIdCode);
		},
		setNoMorePost(noMorePost: boolean) {
			// 先赋初始值值再赋新值
			this.noMorePost = false;
			this.noMorePost = noMorePost;
			// this.$patch({ noMorePost: noMorePost });  // 强制更新状态（即使值相同）
			// console.log('noMorePost已更新:', this.noMorePost);
		},
		setTipsWord(tipsWord: boolean) {
			// 先赋初始值值再赋新值
			this.tipsWord = false;
			this.tipsWord = tipsWord;
			// console.log('tipsWord已更新:', this.tipsWord);
		},
		// 切换 Tab 的方法
		setActiveIndex(index: number) {
			this.activeIndex = index
			// 可在此处统一处理跳转逻辑（替代组件内的 jumpTo）
			// const url = this.tabList[index].url
			// uni.switchTab({ url })
		},
		toggleItemBlur(productName) {
			const index = this.styleList.findIndex(item => item.productName === productName)
			if (index !== -1) {
				// 使用 Vue 的响应式方式修改数组项
				this.styleList[index] = {
					...this.styleList[index],
					isBlurred: !this.styleList[index].isBlurred
				}
				// 如果需要强制更新（可选）
				this.styleList = [...this.styleList]
			}
		},
	},
})